<template>
    <div class="qiye_chenter">
        <div class="qiyeinfo">
            <el-descriptions title="" column="3">
                <el-descriptions-item label="企业名称">大连素食有限公司</el-descriptions-item>
                <el-descriptions-item label="统一社会信用代码">2012000043245689567</el-descriptions-item>
                <el-descriptions-item label="公司注册地址">辽宁省大连市金普新区和平路56号</el-descriptions-item>
            </el-descriptions>
            <el-descriptions title="" column="2">
                <el-descriptions-item label="企业名称">大连素食有限公司</el-descriptions-item>
                <el-descriptions-item label="统一社会信用代码">2012000043245689567</el-descriptions-item>
                <el-descriptions-item label="公司注册地址">辽宁省大连市金普新区和平路56号</el-descriptions-item>
                <el-descriptions-item label="机构类型"> 企业机构</el-descriptions-item>
                <el-descriptions-item label="企业性质">私营企业</el-descriptions-item>
                <el-descriptions-item label="企业成立日期">2021年-05月13日</el-descriptions-item>
                <el-descriptions-item label="法人/负责人">李华</el-descriptions-item>
                <el-descriptions-item label="负责人身份证">210282198706235543</el-descriptions-item>
                <el-descriptions-item label="负责人身份证扫描件">
                    <el-tag size="small">查看图片</el-tag>
                </el-descriptions-item>
                <el-descriptions-item label="单位联系地址">辽宁省大连市金普新区和平路56号</el-descriptions-item>
                <el-descriptions-item label="经营范围">江苏省苏州市吴中区吴中大道 1188 号</el-descriptions-item>
                <el-descriptions-item label="饮食公司简介">大连素食有限公司是—家致力于研究素食美味的公司</el-descriptions-item>
                <el-descriptions-item label="营业执照有效期">辽宁省大连市金普新区和平路56号</el-descriptions-item>
                <el-descriptions-item label="营业执照扫描件">
                    <el-tag size="small">营业执照扫描件</el-tag>
                </el-descriptions-item>
                <el-descriptions-item label="开户行">大连银行</el-descriptions-item>
                <el-descriptions-item label="银行账号">63299427971907320931709</el-descriptions-item>
                <el-descriptions-item label="开户行地址">辽宁省大连市金普新区农贸街65号</el-descriptions-item>
                <el-descriptions-item label="单位注册电话">8657-4321</el-descriptions-item>
                <el-descriptions-item label="单位注册地址">辽宁省大连市金普新区和平路56号</el-descriptions-item>
                <el-descriptions-item label="注册资本(万元) ">200.00</el-descriptions-item>
                <el-descriptions-item label="实缴资本：">100.00万元</el-descriptions-item>
                <el-descriptions-item label="开户许可证/基本户存款信息证">
                    <el-tag size="small">查看图片</el-tag>
                </el-descriptions-item>
            </el-descriptions>
            <!-- Form -->
            <div class="submit-btn">
                <el-button type="primary" @click="dialogFormVisible = true">修改</el-button>
            </div>
            <el-dialog width="60%" title="修改企业信息" :visible.sync="dialogFormVisible">
                <el-form label-position="right" :inline="true" :model="form">
                    <el-form-item label="公司注册地址" :label-width="formLabelWidth">
                        <el-input v-model="form.name" p autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="机构类型" :label-width="formLabelWidth">
                        <el-select v-model="form.region" placeholder="请选择活动区域">
                            <el-option label="区域一" value="shanghai"></el-option>
                            <el-option label="区域二" value="beijing"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="企业性质" :label-width="formLabelWidth">
                        <el-select v-model="form.region" placeholder="请选择活动区域">
                            <el-option label="区域一" value="shanghai"></el-option>
                            <el-option label="区域二" value="beijing"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="成立日期" :label-width="formLabelWidth">
                        <el-input v-model="form.name" autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="法人/负责人" :label-width="formLabelWidth">
                        <el-input v-model="form.name" p autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="人/负责人身份证" :label-width="formLabelWidth">
                        <el-input v-model="form.name" p autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="单位联系地址" :label-width="formLabelWidth">
                        <el-input v-model="form.name" p autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="经营范围" :label-width="formLabelWidth">
                        <el-input v-model="form.name" p autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="营业执照扫描件" :label-width="formLabelWidth">
                        <el-button type="primary">上传<i class="el-icon-upload el-icon--left"></i></el-button>
                    </el-form-item>
                    <el-form-item label="公司简介" :label-width="formLabelWidth">
                        <el-input v-model="form.name" p autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="营业执照有效期" :label-width="formLabelWidth">
                        <el-input v-model="form.name" p autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="法人/负责人身份证扫描件" :label-width="formLabelWidth">
                        <el-button type="primary">上传<i class="el-icon-upload el-icon--left"></i></el-button>
                    </el-form-item>
                    <el-form-item label="开户行" :label-width="formLabelWidth">
                        <el-input v-model="form.name" p autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="银行账户" :label-width="formLabelWidth">
                        <el-input v-model="form.name" p autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="开户行地址" :label-width="formLabelWidth">
                        <el-input v-model="form.name" p autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="单位注册电话" :label-width="formLabelWidth">
                        <el-input v-model="form.name" p autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="单位注册地址" :label-width="formLabelWidth">
                        <el-input v-model="form.name" p autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="注册资本（万元）" :label-width="formLabelWidth">
                        <el-input v-model="form.name" p autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="实缴资本（万元）" :label-width="formLabelWidth">
                        <el-input v-model="form.name" p autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="开户许可证/基本户存款信息证" :label-width="formLabelWidth">
                        <el-button type="primary">上传<i class="el-icon-upload el-icon--left"></i></el-button>
                    </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button @click="dialogFormVisible = false">取 消</el-button>
                    <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
                </div>
            </el-dialog>
        </div>
    </div>
</template>

<script>
import CountData from '../data/CountData'

export default {
    data() {
        return {
            TableData: [],
            CountData,
            dialogFormVisible: false,
            formLabelWidth: '120px',
            // form表单的值，自己设置并绑定到form表单内
            form: {
                name: '',
                region: ''
            }
        }
    },
    methods: {

    },
    mounted() {

    }
}
</script>

<style lang="less" scoped>
.qiye_chenter {
    width: 90%;
    height: 90%;
    margin-top: 20px;
    margin-left: 30px;

    .qiyeinfo {
        position: relative;
        width: 70%;
        height: 100%;
        padding: 20px;
        border-radius: 10px;
        background: #fff;

        .submit-btn {
            position: absolute;
            right: 20px;
            bottom: 20px;
        }

        /deep/ .el-form input {
            width: 300px;

        }

        .el-form-item {
            margin-bottom: 10px;
        }

        /deep/ .el-button--primary {
            background-color: #00e6b7;
            border: none;
        }

        /deep/ .qiye_chenter .qiyeinfo[data-v-46d3ecb9] .el-button--primary {
            background-color: #00e6b7;
        }

    }

    .item_col {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;

        .item_ll {
            width: 48%;

        }
    }
}
</style>